<link rel="stylesheet" href="../src/css/pages/adPublishCondition.css">
<!-- <section>
	<ol class="breadcrumb">
		<li>{{i18n-advertsDelivery}}</li>
		<li class="active">{{i18n-productManage}}</li>
	</ol>
</section> -->
<div class="fmp-container">
    <div class="container-fluid">
        <div class="row" id="search-area" style="padding-bottom: 12px;margin-top: 20px;">
            <div class="text-search col-sm-5 no-margin">
                <!--<input name="app-name" class="form-control col-sm-12" placeholder="{{i18n-appNameHolder}}" />-->
                <div class="ndp-search-wrapper" name="app-name" style="width:100%"></div>
            </div>
            <div class="form-group col-sm-1 no-margin" style="padding-left: 5px;padding-right: 5px;">
                <a href="javascript:void(0)" class="btn btn-primary btn-sm col-sm-12" id="search-action">
                    <i class="icon-search"></i> {{i18n-search}}
                </a>
            </div>
            <div class="form-group col-sm-2 no-margin hidden" id="addProductDiv" style="padding-left: 5px;">
                <a href="javascript:void(0)" class="btn btn-primary btn-sm" id="add-product-btn">
                    <i class="icon-search"></i> {{i18n-addProduct}}
                </a>
            </div>
        </div>
        <div class="conditions-table">
            <!--列表：开始-->
            <table class="smart-form" list-manager="adpublishconditionList">
                <thead>
                <tr>
                    <th width="55" th-name="order">{{i18n-order}}</th>
                    <th th-name="status" valign="middle">{{i18n-deliveryStatus}}</th>
                    <th th-name="connObjName">{{i18n-productName}}</th>
                    <th th-name="prodCfgName">{{i18n-platform}}</th>
                    <th th-name="actionDescribe">{{i18n-operation}}</th>
                    <th th-name="operationTime">{{i18n-operationTime}}</th>
                </tr>
                </thead>
                <tbody id="conditions-grid">
                </tbody>
            </table>
            <!--列表：结束-->
        </div>
    </div>
</div>
<!--详细页弹出框：开始-->
<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" id="detail-page">
    <div class="modal-dialog modal-lg" style="width:890px;min-height:620px;" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">{{i18n-editDeliveryRequirements}}</h4>
            </div>
            <div class="modal-body form-horizontal">
                <section>
                    <div class="form-group" style="margin-bottom: 20px;">
                        <label class="col-md-2 control-label" style="padding-right:5px;width:120px;">{{i18n-productAndPlatform}}</label>
                        <div class="col-md-9" style="width:318px;">
                            <input class="form-control" type="text" disabled="disabled" name="obj-and-prodCfg"/>
                        </div>
                    </div>
                    <div class="form-group" style="margin-bottom: 20px;">
                        <label class="col-md-2 control-label" style="padding-right:5px;width:120px;">{{i18n-shortForApplication}}</label>
                        <div class="col-md-9" style="width:318px;">
                            <input class="form-control" type="text" name="connObjSimpleName"
                                   placeholder="{{i18n-shortApplicationHolder}}"/>
                        </div>
                    </div>
                    <div class="form-group" style="margin-bottom: 20px;">
                        <label class="col-md-2 control-label"
                               style="padding-right:5px;width:120px;">{{i18n-page}}</label>
                        <div class="col-md-9" style="width:318px;">
                            <select class="form-control" name="mainPage" style="width:100%">
                            </select>
                        </div>
                    </div>
                    <!--<div class="form-group">-->
                        <!--<label class="col-md-2 control-label" style="padding-right:5px;width:120px;">{{i18n-locationAndPrice}}</label>-->
                        <!--<div class="col-md-9">-->
                            <!--<div>-->
                                <!--<div class="fullRegion radio-con form-inline mb-10">-->
                                    <!--<input type="radio"  id="region-radio-global" name="region-radio" class="form-input radiobox" value="global">-->
                                    <!--<label for="region-radio-global" class="m-l-20">-->
                                        <!--<span class="radio-dot"></span>-->
                                        <!--{{i18n-global}}-->
                                    <!--</label>-->
                                    <!--<div class="no-padding relative price-area">-->
                                        <!--<input type="text" class="form-control" placeholder="{{i18n-price}}"-->
                                               <!--name="prices">-->
                                        <!--<span class="money-unit-position">$</span>-->
                                    <!--</div>-->
                                <!--</div>-->
                                <!--<div class="includeRegion radio-con">-->
                                    <!--<input type="radio"  id="region-radio-include" name="region-radio"class="form-input radiobox" value="include">-->
                                    <!--<label for="region-radio-include" class="m-l-20">-->
                                        <!--<span class="radio-dot"></span>-->
                                        <!--{{i18n-specifyLocation}}-->
                                    <!--</label>-->
                                    <!--<div class="specified">-->
                                        <!--<div class="regionAndPrices">-->
                                        <!--</div>-->
                                        <!--<button class="btn btn-primary" fb-add="">{{i18n-add}}</button>-->
                                    <!--</div>-->
                                <!--</div>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="form-group">-->
                        <!--<label class="col-md-2 control-label" style="padding-right:5px;width:120px;">{{i18n-excludeLocation}}</label>-->
                        <!--<div class="col-md-9 excludeRegion only-lb">-->
                            <!--<select type="text" name="location" style="width:100%;"-->
                                    <!--placeholder="{{i18n-excludeLocationHolder}}">-->
                            <!--</select>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="form-group">-->
                        <!--<label class="col-md-2 control-label"-->
                               <!--style="padding-right:5px;width:120px;">{{i18n-age}}</label>-->
                        <!--<div class="col-md-9">-->
                            <!--<div class="col-md-3 no-padding" style="width:90px;">-->
                                <!--<select name="ageMin" style="width:100%"></select>-->
                            <!--</div>-->
                            <!--<div class="col-md-1 text-center" style="line-height:32px; width:20px; padding:0px;">-->
                                <!--{{i18n-to}}-->
                            <!--</div>-->
                            <!--<div class="col-md-3 no-padding" style="width:90px;">-->
                                <!--<select name="ageMax" style="width:100%"></select>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="form-group">-->
                        <!--<label class="col-md-2 control-label"-->
                               <!--style="padding-right:5px;width:120px;">{{i18n-gender}}</label>-->
                        <!--<div class="col-md-9" style="padding-top:7px;padding-left:22px;">-->
                            <!--<input type="radio"  id="sex1" name="sex" checked="checked" class="form-input" value="1">-->
                            <!--<label for="sex1" class="m-l-20 m-r-45">-->
                                <!--<span class="radio-dot"></span>-->
                                <!--{{i18n-all}}-->
                            <!--</label>-->
                            <!--<input type="radio"  id="sex2" name="sex" checked="checked" class="form-input" value="2">-->
                            <!--<label for="sex2" class="m-l-20 m-r-45">-->
                                <!--<span class="radio-dot"></span>-->
                                <!--{{i18n-men}}-->
                            <!--</label>-->
                            <!--<input type="radio"  id="sex3" name="sex" checked="checked" class="form-input" value="3">-->
                            <!--<label for="sex3" class="m-l-20 m-r-45">-->
                                <!--<span class="radio-dot"></span>-->
                                <!--{{i18n-women}}-->
                            <!--</label>-->

                            <!--&lt;!&ndash;<label class="checkbox-inline">&ndash;&gt;-->
                                <!--&lt;!&ndash;<input type="checkbox" value="1" class="checkbox" name="sex" checked="checked">&ndash;&gt;-->
                                <!--&lt;!&ndash;<span>{{i18n-all}}</span>&ndash;&gt;-->
                            <!--&lt;!&ndash;</label>&ndash;&gt;-->
                            <!--&lt;!&ndash;<label class="checkbox-inline" style="margin-left:45px;">&ndash;&gt;-->
                                <!--&lt;!&ndash;<input type="checkbox" value="2" class="checkbox" name="sex">&ndash;&gt;-->
                                <!--&lt;!&ndash;<span>{{i18n-men}}</span>&ndash;&gt;-->
                            <!--&lt;!&ndash;</label>&ndash;&gt;-->
                            <!--&lt;!&ndash;<label class="checkbox-inline" style="margin-left:45px;">&ndash;&gt;-->
                                <!--&lt;!&ndash;<input type="checkbox" value="3" class="checkbox" name="sex">&ndash;&gt;-->
                                <!--&lt;!&ndash;<span>{{i18n-women}}</span>&ndash;&gt;-->
                            <!--&lt;!&ndash;</label>&ndash;&gt;-->
                        <!--</div>-->
                    <!--</div>-->
                </section>

                <section class="hidden">
                    <div class="form-group">
                        <label class="col-md-2 control-label"
                               style="padding-right:5px;width:120px;">{{i18n-bidLimit}}</label>
                        <div class="col-md-9 bid-type-area">
                            <table class="condition-table" border="0" cellspacing="0" style="width:520px;">
                                <thead>
                                <tr>
                                    <th style="width:148px;text-align:left;padding-left:20px !important;">
                                        {{i18n-optimization}}
                                    </th>
                                    <th style="width:372px;text-align:left;padding-left:10px !important;">
                                        {{i18n-billingEvent}}
                                    </th>
                                </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </section>
                <hr/>
                <section>
                    <div class="form-group hidden">
                        <label class="col-md-2 control-label"
                               style="padding-right:5px;width:120px;">{{i18n-adAccounts}}</label>
                        <div class="col-md-8">
                            <input class="form-control" placeholder="{{i18n-addAccountsHolder}}" type="text"
                                   disabled="disabled" name="accounts"/>
                        </div>
                        <div class="col-md-1 no-padding text-center">
                            <span class="edit-accounts fa fa-edit"></span>
                        </div>
                    </div>
                    <div class="form-group" id="cpaConfigDiv">
                        <label class="col-md-2 control-label"
                               style="padding-right:5px;width:120px;">{{i18n-adAccounts}}</label>
                        <div class="col-md-9">
                            <table class="accountTable" border="0" cellspacing="0"
                                   style="width:520px;margin-bottom: 10px;">
                                <thead>
                                <tr>
                                    <th style="width:390px;text-align:left;padding-left:20px !important;">
                                        {{i18n-accountName}}
                                    </th>
                                    <!--<th style="width:130px;text-align:left;padding-left:20px !important;">
                                        {{i18n-accountCPAAccess}}
                                    </th>-->
                                </tr>
                                </thead>
                                <tbody id="cpa-config">
                                </tbody>
                            </table>
                            <button class="btn detailPageUpdateAccount" name="detailPageUpdateAccount">
                                {{i18n-updateAccount}}
                            </button>
                        </div>
                    </div>
                </section>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" commit>{{i18n-confirm}}</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">{{i18n-cancel}}</button>
            </div>
        </div>
    </div>
</div>
<!--详细页弹出框：结束-->
<!--选择账号弹出框：开始-->
<div class="modal fade dialog-accounts" tabindex="-1" role="dialog">
    <div class="modal-dialog" style="width:560px;" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">{{i18n-selectAccounts}}</h4>
            </div>
            <div id="detail-select-account-content" style="padding:20px;background-color: white;min-height:155px;">
                <!--列表：开始-->
                <table id="ruleSettingTable" list-manager="detailSelectAccountList" style="width:520px;">
                    <thead>
                    <tr>
                        <th style="width:80px" th-name="select"><label><input type="checkbox" id="checkbox-account-all"><span
                                style="margin-left:10px;">{{i18n-order}}</span></label></th>
                        <th th-name="accountName">{{i18n-accountName}}</th>
                        <th style="width:85px" th-name="cPAAccess">{{i18n-cPAAccess}}</th>
                    </tr>
                    </thead>
                    <tbody id="detail-select-account-grid">
                    </tbody>
                </table>
                <!--列表：结束-->
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" commit>{{i18n-confirm}}</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">{{i18n-cancel}}</button>
            </div>
        </div>
    </div>
</div>
<!--选择账号弹出框：结束-->
<!--添加产品弹出框：开始-->
<div class="modal fade dialog-add-product" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-md" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">{{i18n-addProduct}}</h4>
            </div>
            <div class="modal-body">
                <div>
                    <label>{{i18n-productName}}</label>
                    <input class="product-name"/>
                </div>
                <div class="mt-15">
                    <label>{{i18n-productType}}</label>
                    <div class="c-select-container">
                        <select name="product-type" style="width:100%">
                        </select>
                    </div>
                </div>
                <div class="mt-15">
                    <label>{{i18n-platform}}</label>
                    <div class="c-select-container">
                        <select name="product-platform" style="width:100%">
                        </select>
                    </div>
                </div>
                <div class="mt-15" id="mk-pixel-id">
                    <label>{{i18n-mkPixelId}}</label>
                    <input class="mk-pixel-id"/>
                </div>
                <div class="mt-15">
                    <label>{{i18n-productUrl}}</label>
                    <textarea></textarea>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" commit>{{i18n-confirm}}</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">{{i18n-cancel}}</button>
            </div>
        </div>
    </div>
</div>
<!--添加产品弹出框：结束-->
<div class="modal fade dialog-accounts-timezone" tabindex="-1" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">{{i18n-accountTimezoneConfirm}}</h4>
            </div>
            <div class="modal-body">
                <p>{{i18n-accountTimezoneInconsistent}}</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" confirm>{{i18n-confirm}}</button>
                <button type="button" class="btn btn-default" cancel>{{i18n-cancel}}</button>
            </div>
        </div>
    </div>
</div>
